import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex);

// 首先声明一个单一状态数 state
const state = {
  count: 0
}

// 获取自定义状态信息
const getters = {
  newCount: (state) => {//通过方法访问
    return "我是经过getter处理得来的:"+ state.count;
  }
};

// 更新状态，该步只能同步处理，不可异步
const mutations = {
  increment (state, str) {
    state.count = state.count + 5+ str
  },
  decrement (state) {
    state.count = state.count - 3
  }
};

// 然后给 actions 注册事件处理函数，当这个函数被触发时，将状态提交到 mutaions中处理
const actions = {
  // 提交到mutations中处理
  increment: ({ commit }, str) => {
    //str:传递的参数
    commit('increment', str)
  },
  // 提交到mutations中处理
  decrement: ({ commit }) => commit('decrement')
};

// 下面这个相当关键了，所有模块，记住是所有，注册才能使用
export default new Vuex.Store({
  state,
  mutations,
  actions,
  getters
})
